<template>
	<view>
		<!-- #ifdef APP-PLUS -->
		<view>
			<uni-nav-bar title="合伙人" :statusBar='true' :fixed="true"></uni-nav-bar>
		</view>
		<!-- #endif -->
		<view class="index">
			<view class="index-info">
				<view class="index-infos">
					<image :src="agent.avatar" class="index-info-image"></image>
					<view class="index-info-text">
						<view class="index-info-text-title">{{ agent.realName }}</view>
						<view class="index-info-text-p">代理区域：{{ agent.province }}{{ agent.city }}{{ agent.area }}</view>
						<view class="index-info-text-p">代理商号：{{ agent.id }}</view>
					</view>
					<!-- 这个是一个弹窗，有人注册才给 -->
					<!-- <view class="registration">新注册会员 Robot M,5分钟前</view> -->
				</view>
			</view>
			<view class="index-info-sever">
				<view class="index-info-sever-title">我的服务</view>
				<view class="index-info-sever-ul">
					<view @click="onClickGotoSQLB" class="index-info-sever-ul-li">
						<image src="../../static/index/sqlb.png" class="index-info-sever-ul-li-image"></image>
						<view class="index-info-sever-ul-li-text">申请列表</view>
					</view>
					<view @click="onClickGotoPZGL" class="index-info-sever-ul-li">
						<image src="../../static/index/pzgl.png" class="index-info-sever-ul-li-image"></image>
						<view class="index-info-sever-ul-li-text">凭证管理</view>
					</view>
					<view @click="onClickGotoEDK" class="index-info-sever-ul-li">
						<image src="../../static/index/edk.png" class="index-info-sever-ul-li-image"></image>
						<view class="index-info-sever-ul-li-text">额度卡</view>
					</view>
					<view @click="onClickGotoHYGL" class="index-info-sever-ul-li">
						<image src="../../static/index/hygl.png" class="index-info-sever-ul-li-image"></image>
						<view class="index-info-sever-ul-li-text">会员管理</view>
					</view>
				</view>
			</view>
			<view @click="onClickGoToYYSJ" class="index-info-nav">
				<text>运营数据</text>
			</view>
			<view @click="onClickExit" class="index-info-nav">
				<text>退出登录</text>
			</view>
		</view>
	</view>
</template>

<script>
	import { config } from '@/utils/config.js';
	import uniNavBar from '@/components/uni-nav-bar/uni-nav-bar.vue';
	export default {
		components: {
			uniNavBar
		},
		data() {
			return {
				agent: {}
			}
		},
		onShow() {
			const token = uni.getStorageSync('d_token')
			if (!token) {
				uni.showToast({
					icon: 'none',
					title: '尚未登录, 请先登录'
				})
				setTimeout(() => {
					uni.removeStorageSync('d_role')
					uni.removeStorageSync('d_memberId')
					uni.removeStorageSync('d_token')
					uni.removeStorageSync('d_openId')
					uni.reLaunch({
						url: '../verificationcodelogin/verificationcodelogin'
					})
				}, 777)
				return false
			}
			this._getAgent()
			this._getNewRegisterPeople()
		},
		methods: {
			onClickExit() {
				uni.showModal({
					content: '确定要退出登录吗',
					success: ((res) => {
						if (res.confirm) {
							uni.showLoading({
								title: '正在退出'
							})
							setTimeout(() => {
								uni.hideLoading()
								uni.removeStorageSync('d_role')
								uni.removeStorageSync('d_memberId')
								uni.removeStorageSync('d_token')
								uni.removeStorageSync('d_openId')
								uni.reLaunch({
									url: '../verificationcodelogin/verificationcodelogin'
								})
							}, 3333)
						}
					})
				})
			},
			_getAgent() {
				uni.request({
					url: `${config.api_base_url}agent/agent/personalCenter`,
					header: {
						AUTH: 'ROBOT ' + uni.getStorageSync('d_token')
					},
					success: ((res) => {
						let { status, data } = res.data
						if (status.flag === true) {
							this.agent = data
						} else {
							this.agent = {}
						}
					}),
					fail: (() => {
						uni.showToast({
							icon: 'none',
							title: '请求失败, 网络异常'
						})
					})
				})
			},
			_getNewRegisterPeople() {
				uni.request({
					url: `${config.api_base_url}agent/agentMember/newMemberReminder`,
					header: {
						AUTH: 'ROBOT ' + uni.getStorageSync('d_token')
					},
					success: ((res) => {
						let { status, data } = res.data
					}),
					fail: (() => {
						uni.showToast({
							icon: 'none',
							title: '请求失败, 网络异常'
						})
					})
				})
			},
			onClickGoToYYSJ() {
				uni.navigateTo({
					url: '../operationaldata/operationaldata'
				})
			},
			onClickGotoSQLB() {
				uni.navigateTo({
					url: '../merchantsapplylist/merchantsapplylist'
				})
			},
			onClickGotoPZGL() {
				uni.navigateTo({
					url: '../certificatelist/certificatelist'
				})
			},
			onClickGotoEDK() {
				uni.navigateTo({
					url: '../quotacard/quotacard'
				})
			},
			onClickGotoHYGL() {
				uni.navigateTo({
					url: '../vipmanage/vipmanage'
				})
			}
		}
	}
</script>
<style>
	page {
		background: #F5F5F5;
	}
</style>
<style scoped>
	.index {}

	.index-info {
		height: 244rpx;
		background: linear-gradient(180deg, rgba(0, 145, 255, 1) 0%, rgba(245, 245, 245, 1) 100%);
		padding: 30rpx 15rpx 0rpx;
		box-sizing: border-box;

	}

	.index-infos {
		height: 214rpx;
		background: rgba(255, 255, 255, 1);
		box-shadow: 0px 4rpx 12rpx 0px rgba(0, 0, 0, 0.05);
		border-radius: 12rpx;
		padding: 32rpx 26rpx;
		box-sizing: border-box;
		display: flex;
		justify-content: space-between;
		position: relative;
	}

	.index-info-image {
		width: 96rpx;
		height: 96rpx;
		background: #f00;
		border-radius: 50%;
		flex-shrink: 0;
		margin-right: 20rpx;
	}

	.registration {
		height: 46rpx;
		background: rgba(0, 0, 0, 0.65);
		border-radius: 30rpx;
		font-size: 24rpx;
		color: #fff;
		position: absolute;
		line-height: 46rpx;
		bottom: 2rpx;
		left: 1rpx;
		padding: 0rpx 30rpx;
		box-sizing: border-box;
	}

	.index-info-text {
		width: 100%;
	}

	.index-info-text-title {
		font-size: 32rpx;
		color: #000;
		line-height: 44rpx;
		font-weight: 600;
		margin-bottom: 10rpx;
	}

	.index-info-text-p {
		font-size: 24rpx;
		color: #6D7278;
		line-height: 34rpx;
	}

	.index-info-sever {
		margin: 22rpx 15rpx;
		background: rgba(255, 255, 255, 1);
		border-radius: 22rpx;
		padding: 0rpx 10rpx 30rpx;
	}

	.index-info-sever-title {
		height: 80rpx;
		font-size: 28rpx;
		font-weight: 500;
		color: rgba(0, 0, 0, 0.85);
		line-height: 80rpx;
		width: 100%;
		padding-left: 32rpx;
		box-sizing: border-box;
	}

	.index-info-sever-ul {
		overflow: hidden;
	}

	.index-info-sever-ul-li {
		width: 25%;
		float: left;
	}

	.index-info-sever-ul-li-image {
		width: 52rpx;
		height: 52rpx;
		display: block;
		margin: 0rpx auto 20rpx;
	}

	.index-info-sever-ul-li-text {
		height: 34rpx;
		font-size: 24rpx;
		font-weight: 400;
		color: rgba(109, 114, 120, 1);
		line-height: 34rpx;
		text-align: center;

	}

	.index-info-nav {
		margin: 22rpx 15rpx;
		background: rgba(255, 255, 255, 1);
		border-radius: 12rpx;
		padding: 0rpx 43rpx 0rpx;
		height: 84rpx;
		box-sizing: border-box;
	}

	.index-info-nav text {
		font-size: 28rpx;
		color: rgba(0, 0, 0, 0.85);
		height: 84rpx;
		line-height: 84rpx;
		position: relative;
		width: 100%;
		display: block;
	}

	.index-info-nav text::after {
		content: "";
		position: absolute;
		right: 0rpx;
		top: 50%;
		width: 18rpx;
		height: 18rpx;
		border-left: 3rpx solid #242424;
		border-top: 3rpx solid #242424;
		transform: translate3d(0, -50%, 0) rotateZ(135deg);
		-webkit-transform: translate3d(0, -50%, 0) rotateZ(135deg);
	}
</style>
